<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/component/commonTagLib.jsp"%>

<!DOCTYPE html>
<html>
<head>
    <title><spring:message code="message.lable.drugqualityspecSeeStd"/></title>
    <%@ include file="/WEB-INF/component/commonCSS.jsp"%>
    <!--[if lt IE 9]>
        <script src="${ctx}/lib/js/html5shiv.min.js"></script>
        <script src="${ctx}/lib/js/respond.min.js"></script>
    <![endif]-->
</head>
<body class="skin-blue-light sidebar-mini fixed skin-blue-light-frame">
                            
    <section class="content-header">
        <h1>医院采购情况</h1>
        <ol class="breadcrumb">
            <li><a href="${ctx}/home.jsp"><i class="fa fa-home"></i><spring:message code="message.lable.first"/></a></li>
                <li><a href="#">统计查询</a></li>
                <li><a href="#">采购指标化统计</a></li>
                <li><a href="#">医院采购情况</a></li>
        </ol>
    </section>
        
    <section class="content">
 
        <div class=" box box-success">
            <div class="box-body">
             <form  id="form" method="post">
                <div class="input">
                	<div class="textalign">医疗机构名称<spring:message code="message.yanZheng.maoHao"/></div>
                    <div class="boxinput">
                         <input type="text" class="textinput" id="hospName" name="hospName" placeholder="医疗机构名称" maxlength="100"  /> 
                    </div>
                    <div class="textalign">统计月份<spring:message code="message.yanZheng.maoHao"/></div>
                    <div class="boxinput">
                    		<table style="width:100%">
                    			<tr>
                    				<td style="width:50%">
                    					<input id="startMonth" name="startMonth" class="textinput" type="text" readonly placeholder="开始月份"  data-date-fmt="yyyy-MM"  onfocus="WdatePicker({dateFmt:'yyyy-MM',maxDate:'#F{$dp.$D(\'endMonth\')}'})"/>
                    				</td>
                    				<td>&nbsp;-&nbsp;</td>
                    				<td style="width:50%">
                    					<input id="endMonth" name="endMonth" class="textinput" type="text" readonly placeholder="结束月份"  data-date-fmt="yyyy-MM"  onfocus="WdatePicker({dateFmt:'yyyy-MM',minDate:'#F{$dp.$D(\'startMonth\')}'})"/>
                    				</td>
                    			</tr>
                    		</table>
                    </div>
                     <div class="textalign" >
                         <button id="selectSpec" type="button" onclick="search();" class="btn btn-success btn-sm"><spring:message code="message.button.seachSpacing"/></button>
                    </div>
                </div>
            </form>
            </div>
          </div>
             	<div class="box box-warning">
    		<div class="box-header with-border">
    			<center><h3 class="box-title" id="chartTitle">不同类型医院采购占比</h3></center>
            </div>
            <div class="box-body mchart">
                <div id="mChart" style="height: 440px; width:98%; padding: 8px;"></div>
            </div>
        </div>
 <!--        <div class=" box box-warning bottongroup">
			<button type="button" onclick="toYearAnaByHosp();" class="btn btn-primary btn-sm">按年汇总</button>
			<button type="button" onclick="toSeaAnaByHosp ();" class="btn btn-primary btn-sm">按季度汇总</button>
			<button type="button" onclick="toAnaByHosp();" class="btn btn-primary btn-sm">按日汇总</button>
        </div> -->
    </section>
      <%@ include file="/WEB-INF/component/commonJS.jsp"%>
    <script type="text/javascript">
        $(function () {
        	$('#form :input').bind('keydown', function(event) {if (event.keyCode == "13") {search();}}).eq(0).focus();
        	
        	var option = {
        		    title : {
        		        text: '',
        		        x:'center'
        		    },
                    	tooltip: {
                    		  text: '不同类型医院采购占比',
                        	trigger: 'item',
                        	formatter: "{a} <br/>{b} : {c} ({d}%)"
                        },
                        calculable: true,
                        legend: {
                        	   orient : 'vertical',
                               x : 'left',
                            data: ['基药采购金额', '非基药采购金额']
                        },
              
                        series: [
                            {
                                name: '',
                                type: 'pie',
                                radius : '55%',
                                center: ['50%', '60%'],
                                data: [{value:120000,name:'基药采购金额'},
                                       {value:12000,name:'非基药采购金额'}
                                ]
                            }
                        ]
                };
            	var myChart = echarts.init(document.getElementById('mChart'));
                myChart.setOption(option);
        });
        function search(page) {
            var data =formatForm("form");
            $("#gridlist").jqGrid('setGridParam',{  
                datatype:'json',
                postData:data,
                page : (page || 1)
            }).trigger("reloadGrid"); //重新载入  
        }
        
        function toYearAnaByHosp(){
        	window.location.href="${ctx}/anaDruginfo/toYearAnaByHosp.html"; 
        }
        
        function toSeaAnaByHosp(){
        	window.location.href="${ctx}/anaDruginfo/toSeaAnaByHosp.html"; 
        }
        
        function toAnaByHosp(){
        	window.location.href="${ctx}/anaDruginfo/toAnaByHosp.html"; 
        }
    </script>
</body>
</html> 
                          
                  
                  